<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<head>
		<link rel="stylesheet" type="text/css"	href="${pageContext.request.contextPath}/css/Style_Page.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/jslib/jq_datatables/css/jquery.dataTables.css"	type="text/css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/Style_Table.css"	type="text/css" />
		<script type="text/javascript" language="javascript" src="${pageContext.request.contextPath}/jslib/jquery/jquery.js"></script>
		<script type="text/javascript" language="javascript" src="${pageContext.request.contextPath}/jslib/jq_datatables/js/jquery.dataTables.js"></script>
		<link rel="stylesheet" type="text/css"	href="${pageContext.request.contextPath}/jslib/jq_ui/css/jquery-ui.css">
		<script src="${pageContext.request.contextPath}/jslib/jquery/jquery.json.min.js" type="text/javascript"></script>
		<script src="${pageContext.request.contextPath}//jslib/common/dateutil.js" type="text/javascript"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/jslib/jq_ui/jquery-ui.js"></script>
		<script type="text/javascript">
var urlGetData = '${pageContext.request.contextPath}/plugins/$${Obj.PluginName}$$/$${Obj.ClassNameAllLower}$$/findPage.ilf';
var urlRemove = '${pageContext.request.contextPath}/plugins/$${Obj.PluginName}$$/$${Obj.ClassNameAllLower}$$/delete.ilf';
var urlUpdate = '${pageContext.request.contextPath}/plugins/$${Obj.PluginName}$$/$${Obj.ClassNameAllLower}$$/update.ilf';
var urlCreate = '${pageContext.request.contextPath}/plugins/$${Obj.PluginName}$$/$${Obj.ClassNameAllLower}$$/create.ilf';
var urlExp = '${pageContext.request.contextPath}/plugins/$${Obj.PluginName}$$/$${Obj.ClassNameAllLower}$$/export.ilf';
var iDisplayLength = 10;
var outTableHeight=200;
var aoColumns = [ 
 ##{FIELD
 	{
	"mDataProp" : "$${ObjField.JsFieldNameFirstLower}$$"
	},
	}##];

var aoColumnDefs = [];

/*内部变量-表格变量*/
var oTable;
/*内部变量-条件列表*/
var conditions = [];
/*查询事件*/
function query() {
	var tableName = $("#tablename").val();
	conditions = [ 
	/*拼接查询条件的KeyValue
	{
		"name" : "tablename",
		"value" : tableName
	}, {
		"name" : "tableid",
		"value" : 100
	}*/ ];
	oTable.fnDraw();
};

/*呈现事件*/
function show() {
	var selectItem = getSelected(oTable);
	if (selectItem) {
		$("#operateStatus").val("show");
		var allFields = $("#dialog-form input");
		for ( var i = 0; i < allFields.length; i++) {
			var ff = allFields[i];
			if (selectItem[ff.id]) {
				ff.value = selectItem[ff.id];
			}
		};
		$("#dialog-form").dialog("open");
	} else {
		alert('请先选择一条记录！');
	}
};

/*新增事件 */
function create() {
	var allFields = $("#dialog-form input");
	$("#operateStatus").val("add");
	allFields.each(function(idx) {
		this.value = "";
	});
	$("#dialog-form").dialog("open");
};

/*更新事件*/
function update() {
	var selectItem = getSelected(oTable);
	if (selectItem) {
		$("#operateStatus").val("update");
		var allFields = $("#dialog-form input");
		for ( var i = 0; i < allFields.length; i++) {
			var ff = allFields[i];
			if (selectItem[ff.id]) {
				ff.value = selectItem[ff.id];
			}
		};
		$("#dialog-form").dialog("open");
	} else {
		alert('请先选择一条记录！');
	}

};

/*删除事件*/
function remove() {
	var data = getSelected(oTable);
	if (data) {
		//处理时间类型
##{FIELD
	$$<(ObjField.ClassFieldType=Date)	data['$${ObjField.JsFieldNameFirstLower}$$'] = DateUtil.strFormatToDate("yyyy-MM-dd HH:mm:ss",data['$${ObjField.JsFieldNameFirstLower}$$']);>$$
}##
		$.ajax( {
			type : "POST",
			contentType : 'application/json',
			url : urlRemove,
			data : JSON.stringify(data),
			success : function(msg) {
				if (msg == 'success') {
					alert("删除成功！");
					oTable.fnDraw();
				} else {
					alert(showmsg);
				}
			},
			error : function(msg) {
				alert('操作失败！' + msg);
			}
		});
	} else {
		alert('请先选择一条记录！');
	}
};

/*导出Excel*/
function expdata(filetype) {
	var download_file = $("#download_file");
	if (download_file.length == 0) {
		var i = '<iframe id="download_file" name="download_file"></iframe>';
		$("body").append(i);
		download_file = $("#download_file");
	}
	var fileName = "下载文件名称.xls";
	var url = urlExp + "?filename=" + fileName + "&filetype=" + filetype
			+ "&conditions=" + JSON.stringify(conditions);
	download_file.attr("src", url);
	download_file.css("display", "none");
};

/*表格刷新*/
function getData(sSource, aoData, fnCallback) {
	$.ajax( {
		type : "POST",
		url : sSource,
		dataType : "json",
		data : "tableparam=" + JSON.stringify(aoData) + "&conditions="
				+ JSON.stringify(conditions),
		success : function(data) {
			fnCallback(data); //服务器端返回的对象的returnObject部分是要求的格式 
	}
	});
};

/* 获取选择行对象 */
function getSelected(oTable) {
	var aReturn = new Array();
	var aTrs = oTable.fnGetNodes();
	for ( var i = 0; i < aTrs.length; i++) {
		if ($(aTrs[i]).hasClass('row_selected')) {
			aReturn.push(aTrs[i]);
			break;
		}
	}
	if (aReturn && aReturn.length == 1)
		return oTable.fnGetData(aReturn[0]);
	else
		return null;
}

/*初始化*/
$(document).ready(function() {
	if(typeof JSON == 'undefined'){
			$('head').append($("<script type='text/javascript' src='${pageContext.request.contextPath}/jslib/common/json2.js'>"));
	}
	
	var ph = $(window).height() - outTableHeight;
	/*表格配置*/
	oTable = $('#example').dataTable( {
		"bSortClasses" : false,
		"aLengthMenu" : [ 10, 20, 50 ],//每页显示条数设置列表
		"bAutoWidth" : true, //不自动计算列宽度
		"bSort" : true,//是否允许排序
		"bProcessing" : true, //加载数据时显示正在加载信息		
		"bServerSide" : true, //指定从服务器端获取数据
		"bFilter" : false, //不使用过滤功能
		"bLengthChange" : true, //用户不可改变每页显示数量
		"sPaginationType" : "full_numbers", //翻页界面类型
		"bStateSave" : false, //保存状态到cookie,开启可保留搜索文本
		"bScrollCollapse" : true,//是否开启滚动条
		"sScrollY" : ph,//纵向滚动条
		"sScrollX" : "100%",//横向滚动条
		"aoColumns" : aoColumns,
		"aoColumnDefs" : aoColumnDefs,
		"iDisplayLength" : iDisplayLength, //默认每页显示的记录数
		"sDom" : '<"top">frt<"bottom"ilp><"clear">',
		"aaSorting" : [ [ 0, "asc" ] ],
		"fnServerData" : getData, //获取数据的处理函数
		"sAjaxSource" : urlGetData
	});

	/*事件处理*/
	$("#example tbody").click(function(event) {
		$(oTable.fnSettings().aoData).each(function() {
			$(this.nTr).removeClass('row_selected');
		});
		if ($(event.target.parentNode).attr('class') == 'even'|| $(event.target.parentNode).attr('class') == 'odd') {
			$(event.target.parentNode).addClass('row_selected');
		}
	});
	
	$("#btn-query").bind("click", query);
	$("#btn-show").bind("click", show);
	$("#btn-create").bind("click", create);
	$("#btn-update").bind("click", update);
	$("#btn-remove").bind("click", remove);
	$("#btn-export").bind("click", expdata);
	$("#help").click(function(){
			$("#divHelpContent").slideToggle();
  });

	/*新增及修改对话框配置*/
	$("#dialog-form").dialog( {
		autoOpen : false,
		height : 580,
		width : 500,
		modal : true,
		buttons : [ {
			text : "保存",
			click : function() {
				var data = {};
				var allFields = $("#dialog-form input");
				allFields.each(function(idx) {
					data[this.name] = this.value;
				});

				var url;
				var showmsg;
				var os = $("#operateStatus").val();
				if (os == "add") {//新增
				url = urlCreate;
				showmsg = "新增成功！";
			} else if (os == "update"){
				url = urlUpdate;
				showmsg = "修改成功！";
			}else{
				return;
			}
			
			//处理时间类型
##{FIELD
	$$<(ObjField.ClassFieldType=Date)	data['$${ObjField.JsFieldNameFirstLower}$$'] = DateUtil.strFormatToDate("yyyy-MM-dd HH:mm:ss",data['$${ObjField.JsFieldNameFirstLower}$$']);>$$
}##
			
			$.ajax( {
				type : "POST",
				contentType : 'application/json',
				url : url,
				data : $.toJSON(data),
				success : function(msg) {
					if (msg == 'success') {
						alert(showmsg);
						oTable.fnDraw();
					} else {
						alert(showmsg);
					}
				},
				error : function(msg) {
					alert('操作失败！' + msg);
				}
			});
			$(this).dialog("close");
		}
		}, {
			text : "取消",
			click : function() {
				$(this).dialog("close");
			}
		} ]
	});
});
</script>
	</head>
	<body>
		<div class="header">
		<span>功能说明</span>
		<i id="help"></i>
		</div>
		<div id="divHelpContent" style="height:80px;width:100%;" >
			功能说明：。
		</div>
		<!-- 查询条件-->
		<div class="table_conditions">
			<div style="float: right;">
				<input type="button" id="btn-show" value="显示" class="btn"></input>
				<input type="button" id="btn-create" value="添加" class="btn"></input>
				<input type="button" id="btn-update" value="修改" class="btn"></input>
				<input type="button" id="btn-remove" value="删除" class="btn"></input>
				<input type="button" id="btn-export" value="导出" class="btn"></input>
			</div>
			表名：
			<input id="tablename" type="text" width="300px" class="txt" />
			<input type="button" id="btn-query" value="查询" class="btn"></input>
		</div>
		<div class="title">
		<span>查询结果</span>
		</div>
		<!-- 表格呈现 -->
		<table cellpadding="0" cellspacing="0" border="0" id="example">
			<thead>
				<tr>
					##{FIELD					
					<th>$${ObjField.JsFieldNameFirstLower}$$</th>
					}##
				</tr>
			</thead>
			<tbody>
			</tbody>
		</table>
		<!-- 添加及修改 -->
		<input type="hidden" name="operateStatus" id="operateStatus"
			value="none" />
		<div id="dialog-form" title="添加/修改">
			<form>
				<table width="100%" border="0" cellpadding="0" cellspacing="0" class="commontable">
					 ##{FIELD
					<tr>
							<td class="header">$${ObjField.JsFieldNameFirstLower}$$</td>
						  <td><input type="text" name="$${ObjField.JsFieldNameFirstLower}$$" id="$${ObjField.JsFieldNameFirstLower}$$" value="" /></td>
				  </tr>
					}##
				</table>
			</form>
		</div>
	</body>
</html>